<template>
  <div>
    <card :isCustomHeader="true" :isCustomFooter="true">
      <template #header>
        <t-breadcrumb>
          <t-breadcrumbItem>页面1</t-breadcrumbItem>
          <t-breadcrumbItem :to="{ path: '/risk-assessment/governance' }">风险治理</t-breadcrumbItem>
          <t-breadcrumbItem :replace="true" maxWidth="300"
            ><span>{{ description }}</span></t-breadcrumbItem
          >
        </t-breadcrumb>
      </template>
      <template>
        <t-steps v-model="current" :options="steps" readonly style="width: 90%; margin: 0 auto"></t-steps>
      </template>
      <t-divider style="width: 103.6%; margin-left: -1.7%" />
      <div>
        <t-row>
          <!-- 左侧内容 -->
          <t-col :span="6">
            <t-card>
              <div class="description box">
                <span>风险描述</span>:
                {{ riskMsg.description }}
              </div>
              <t-divider style="width: 106.5%; margin-left: -3.4%" />
              <div class="label box">
                <span>风险标签</span>:
                <span v-if="riskMsg.label?.length === 0">无标签</span>
                <span v-else>
                  <span
                    class="tag"
                    :class="{ 'content-orange': riskMsg.type < 4 || riskMsg.type < 4, 'content-red': riskMsg.type > 3 }"
                    v-for="(item, index) in riskMsg.label"
                    :key="index"
                  >
                    <discount-icon class="icon" /> <b>{{ item }}</b>
                  </span>
                </span>
              </div>
              <t-divider style="width: 106.5%; margin-left: -3.4%" />
              <div class="grade box">
                <span>风险等级</span>:
                <div class="tag grade-content common" v-if="riskMsg.type == '6'">未知风险</div>
                <div class="tag grade-content high" v-if="riskMsg.type == '5'">严重风险</div>
                <div class="tag grade-content high" v-else-if="riskMsg.type == '4'">高风险</div>
                <div class="tag grade-content middle" v-else-if="riskMsg.type == '3'">中风险</div>
                <div class="tag grade-content middle" v-else-if="riskMsg.type == '2'">低风险</div>
                <div class="tag grade-content low" v-else-if="riskMsg.type == '1'">无风险</div>
              </div>
              <t-divider style="width: 106.5%; margin-left: -3.4%" />

              <div style="backgroundcolor: #999">
                <t-collapse defaultExpandAll expandIcon borderless expandIconPlacement="right" class="assess box">
                  <t-collapse-panel>
                    <template #header>
                      <b class="collapse-header"
                        >评估来源:
                        <span class="question" @click="toAssessResult" :title="riskMsg.questionName">
                          {{ riskMsg.questionName }}
                        </span>
                      </b>
                    </template>
                    <div class="assess-select">
                      <span>{{ questionContens.title }}</span>
                      <t-form class="question-form">
                        <t-form-item v-if="questionContens.type == 'boolean'">
                          <t-radio-group disabled v-model="radioChoose" class="radio-group">
                            <div v-if="questionContens.type === 'boolean'">
                              <t-radio :value="valueFalse">{{ labelFalse }}</t-radio>
                            </div>
                            <div v-if="questionContens.type === 'boolean'">
                              <t-radio :value="valueTrue">{{ labelTrue }}</t-radio>
                            </div>
                          </t-radio-group>
                        </t-form-item>
                        <t-form-item v-else-if="questionContens.type === 'radiogroup'">
                          <t-radio-group disabled v-model="radioChoose" class="radio-group" :options="questionOption">
                          </t-radio-group>
                        </t-form-item>
                        <t-form-item v-else>
                          <t-checkbox-group
                            class="radio-group"
                            disabled
                            v-model="checkboxChoose"
                            :options="questionOption"
                          ></t-checkbox-group>
                        </t-form-item>
                      </t-form>
                    </div>
                  </t-collapse-panel>
                </t-collapse>
              </div>
              <t-divider style="width: 106.5%; margin-left: -3.4%" />
              <t-collapse defaultExpandAll expandIcon borderless expandIconPlacement="right" class="assess box">
                <t-collapse-panel>
                  <template #header>
                    <b class="collapse-header">法律依据</b>
                  </template>
                  <div class="assess-select">
                    <p ref="law"></p>
                  </div>
                </t-collapse-panel>
              </t-collapse>
            </t-card>
          </t-col>
          <!-- 右侧内容 -->
          <t-col :span="6" :offset="0">
            <div class="box-right">
              <div class="title">
                <b>风险审核</b>
                <img
                  v-show="current !== '1'"
                  class="image"
                  :src="gobackIMg"
                  alt=""
                  title="操作记录"
                  style="float: right; cursor: pointer"
                  @click="goback"
                />
              </div>
              <t-form
                layout="inline"
                :data="formData"
                labelWidth="calc(5em + 24px)"
                ref="form"
                scrollToFirstError="smooth"
              >
                <t-form-item label="风险负责人" name="name" requiredMark>
                  <t-select v-model="formData.principalValue" :options="riskSelection" :disabled="current != '1'">
                    <user-icon slot="prefixIcon" />
                  </t-select>
                </t-form-item>
                <t-form-item label="截止时间" name="password" requiredMark>
                  <t-date-picker
                    v-model="formData.principalDeadline"
                    :disableDate="disableDate"
                    clearable
                    :disabled="current != '1'"
                    format="YYYY-MM-DD hh:mm:ss"
                  />
                </t-form-item>
                <t-form-item label="风险审核人" name="name" requiredMark>
                  <t-select v-model="formData.verifierValue" :options="riskSelection" :disabled="current != '1'">
                    <user-icon slot="prefixIcon" />
                  </t-select>
                </t-form-item>
                <t-form-item label="截止时间" name="password" requiredMark>
                  <t-date-picker
                    v-model="formData.verifierDeadline"
                    :disableDate="disableDate"
                    clearable
                    :disabled="current != '1'"
                    format="YYYY-MM-DD hh:mm:ss"
                  />
                </t-form-item>
                <t-form-item label="处置方案" name="disposalScheme" style="width: 84%">
                  <div style="width: 100%">
                    <t-textarea
                      v-model="formData.disposalScheme"
                      :disabled="current != '1'"
                      class="textarea"
                      :autosize="{ minRows: 3, maxRows: 20 }"
                    >
                      <template #tips>文本框内为预设处置方案内容，请根据实际情况酌情调整</template>
                    </t-textarea>

                    <!-- :autosize="{ minRows: 1, maxRows: 1 }" -->
                  </div>
                </t-form-item>
                <t-form-item
                  label="处置反馈"
                  name="personalProfile"
                  style="width: 84%"
                  v-show="current == '4' || current == '3'"
                >
                  <t-input v-model="formData.disposalDesc" :disabled="current != '1'" />
                </t-form-item>
                <t-form-item
                  label="处置证明"
                  name="personalProfile"
                  style="width: 84%"
                  v-show="current == '4' || current == '3'"
                  v-if="formData.fileName.length !== 0"
                >
                  <div class="files">
                    <div v-for="(item, index) in formData.fileName" :key="index">
                      <a href="#"
                        ><file-paste-icon /> <span class="t-link">{{ item.name }}</span></a
                      >
                    </div>
                  </div>
                </t-form-item>
                <t-form-item label="审核结果" name="personalProfile" style="width: 84%" v-show="current == '4'">
                  <t-select v-model="formData.reviewResult" :options="opinionSelect" disabled> </t-select>
                </t-form-item>
              </t-form>
            </div>
          </t-col>
        </t-row>
        <t-divider style="width: 103.6%; margin-left: -1.7%" />
      </div>
      <t-row class="row-btn">
        <t-col :span="2" :offset="8" :push="2">
          <div class="btn-box">
            <t-button class="cancel" @click="cancel" v-show="current !== '4'" variant="outline" theme="primary"
              >取消</t-button
            >
            <t-button @click="assign" v-show="current == '1'">确认指派</t-button>
            <t-button @click="submitBodyVisible = true" v-show="current == '2'">提交审核</t-button>
            <t-button @click="endBodyVisible = true" v-show="current == '3'">结果审核</t-button>
            <t-button
              class="cancel"
              @click="$router.replace('/risk-assessment/governance')"
              v-show="current == '4'"
              variant="outline"
              theme="primary"
              >退出</t-button
            >
          </div>
        </t-col>
      </t-row>
    </card>
    <!-- 提交审核 -->
    <t-dialog
      header="提交审核"
      :visible="submitBodyVisible"
      :onClose="subBodyClose"
      :onConfirm="subBodyClose"
      :closeOnOverlayClick="false"
      width="500px"
    >
      <div slot="body">
        <t-form labelAlign="top">
          <t-form-item label="针对风险处置过程和结果做简单描述：" requiredMark>
            <t-textarea
              v-model="subTextarea"
              placeholder="请输入更多内容"
              class="text"
              :autosize="{ minRows: 3, maxRows: 20 }"
            />
          </t-form-item>
          <t-form-item label="处置证明" style="min-width: 100px">
            <upload v-model="files" style="min-width: 100px" />
          </t-form-item>
        </t-form>
      </div>
      <template #footer>
        <t-space class="t-btn">
          <t-button @click="subBodyClose">取消</t-button>
          <t-button @click="subFile">提交</t-button>
        </t-space>
      </template>
    </t-dialog>

    <!-- 审核结果 -->
    <t-dialog
      header="审核结果"
      :visible="endBodyVisible"
      :onClose="subBodyClose"
      :onConfirm="subBodyClose"
      :closeOnOverlayClick="false"
    >
      <div slot="body">
        <t-form labelAlign="top">
          <t-form-item label="审核结果" requiredMark placeholder="请选择风险处置结果">
            <t-select v-model="reviewResult" :options="opinionSelect"> </t-select>
          </t-form-item>
          <t-form-item v-show="reviewResult === 3" placeholder="请选择风险处置结果">
            <template #label>风险处置负责人 <help-circle-icon /></template><br />
            <t-select v-model="riskResponsible" required :options="riskSelection">
              <template #prefixIcon>
                <user-icon />
              </template>
            </t-select>
          </t-form-item>
          <t-form-item label="截至日期" requiredMark v-show="reviewResult === 3" placeholder="请选择风险处置结果">
            <t-date-picker
              :disableDate="disableDate"
              v-model="auditDeadline"
              clearable
              format="YYYY-MM-DD  hh:mm:ss"
              style="width: 100%"
            />
          </t-form-item>
          <t-form-item label="审核意见">
            <t-textarea
              v-model="opinionTextarea"
              placeholder="请输入更多内容"
              class="text"
              :autosize="{ minRows: 3, maxRows: 20 }"
            />
          </t-form-item>
        </t-form>
      </div>
      <template #footer>
        <t-space class="t-btn">
          <t-button @click="subBodyClose">取消</t-button>
          <t-button @click="subOpinion">提交</t-button>
        </t-space>
      </template>
    </t-dialog>

    <!-- 风险处置操作记录 -->
    <t-dialog
      header="风险处置操作记录"
      :visible="recordBodyVisible"
      :onClose="recordBodyClose"
      :onConfirm="recordBodyClose"
      :closeOnOverlayClick="false"
      :footer="false"
      width="35%"
    >
      <div slot="body">
        <t-timeline mode="same" theme="default" v-for="(item, index) in operationRecord" :key="index">
          <t-timeline-item>
            <tips-icon size="medium" :style="{ color: color, marginLeft: '2px' }" slot="dot" />
            <div class="record">
              <span class="left" v-if="item.actionType === 1">{{ formData.assignName }}</span>
              <span class="left" v-if="item.actionType === 2">{{ formData.principalValue }}</span>
              <span class="left" v-if="item.actionType === 3">{{ formData.verifierValue }}</span>
              <span class="left" v-if="item.actionType === 4">系统提示</span>
              <div class="right">
                <span class="tip" v-if="item.actionType === 1">风险指派</span>
                <span class="tip" v-if="item.actionType === 2">风险处置</span>
                <span class="tip" v-if="item.actionType === 3">风险审核</span>
                <span class="tip" v-if="item.actionType === 4">处置完成</span>
                <span class="time">{{ item.time || '--' }}</span>
              </div>
            </div>
            <div class="record_content" v-if="item.actionType === 1">
              <div>
                <span><b>风险负责人: </b> {{ JSON.parse(item.content).disposalName }}</span>
                <span style="margin-left: 15%"><b>截止时间: </b>{{ item.disposalStopTime }}</span>
              </div>
              <div>
                <span><b>风险审核人: </b> {{ JSON.parse(item.content).reviewName }}</span>
                <span style="margin-left: 15%"><b>截止时间: </b>{{ item.reviewStopTime }}</span>
              </div>
              <div>
                <span><b>处置方案: </b> {{ JSON.parse(item.content).disposalScheme || '--' }}</span>
              </div>
            </div>
            <div class="record_content" v-if="item.actionType === 2">
              <div><b>处置反馈: </b>{{ JSON.parse(item.content) }}</div>
            </div>
            <div class="record_content" v-if="item.actionType === 3">
              <div>
                <b>审核结果: </b>{{ item.reviewResult }}
                <div><b>审核意见: </b>{{ JSON.parse(item.content).reviewOpinion || '--' }}</div>
              </div>
            </div>
          </t-timeline-item>
        </t-timeline>
      </div>
    </t-dialog>
  </div>
</template>

<script>
import Upload from '@/components/Upload/index.vue';
import { getSessionStorage, setSessionStorage, removeSessionStorage } from '@/utils/storage';
import Card from '@/components/Card/index.vue';
import { DiscountIcon, UserIcon, FilePasteIcon, HelpCircleIcon, TipsIcon } from 'tdesign-icons-vue';
import {
  getRiskMsg,
  getRiskTemplate,
  sendrsAssign,
  requestUploadFile,
  requestcheckReview,
} from '@/service/risk-assessment/governance/index';
import { requestUserByOrg } from '@/service/business-management/role';
import gobackIMg from '@/assets/risk-governance/goback.png';
import { formatDate } from '@/utils';

function getCurrentDate(needTime = false) {
  const d = new Date();
  let month = d.getMonth() + 1;
  month = month < 10 ? `0${month}` : month;
  const date = `${d.getFullYear()}-${month}-${d.getDate()}`;
  const time = `${d.getHours()}:${d.getMinutes()}:${d.getSeconds()}`;
  if (needTime) return [date, time].join(' ');
  return date;
}

export default {
  name: 'riskAssessmentGovernanceProcedure',
  components: {
    Card,
    DiscountIcon,
    UserIcon,
    FilePasteIcon,
    HelpCircleIcon,
    Upload,
    TipsIcon,
  },
  data() {
    return {
      gobackIMg, // 图片
      radioChoose: '',
      checkboxChoose: [],
      valueFalse: '',
      valueTrue: '',
      labelTrue: '',
      labelFalse: '',
      riskMsg: {}, // 风险数据
      questionOption: [],
      questionName: '',
      questionContens: {
        // 问题内容
        title: '',
        type: '',
      },
      serialNumber: [], // 问题序号
      description: '',
      current: '1',
      steps: [
        { title: '风险指派', value: '1', content: '确定风险处置负责人及处置计划' },
        { title: '风险处置', value: '2', content: '简述风险处置结果提交审核' },
        { title: '风险审核', value: '3', content: '审核风险处置的结果' },
        { title: '处置完成', value: '4', content: '风险处置流程结束' },
      ],
      // 表单数据
      formData: {
        assignName: '', // 指派人
        assignTime: '', // 指派时间
        principalValue: '', // 风险处置人
        disposalTime: '', // 风险处置时间
        verifierValue: '', // 风险审核人
        principalDeadline: '', // 处置截止时间
        verifierDeadline: '', // 审核截止日期
        disposalScheme: '',
        disposalDesc: '',
        fileName: [],
        reviewResult: '',
        reviewTime: '', // 审核时间
        reviewOpinion: '', // 审核意见
      },
      // 审核和负责人的选项列表
      riskSelection: [],
      submitBodyVisible: false, // 提交审核弹出的对话框
      endBodyVisible: false, // 结果审核弹出的对话框
      // 提交审核对话框的数据
      files: [],
      autoUpload: true,
      display: 'file',
      subTextarea: '',
      // 结果审核对话框的数据
      opinionTextarea: '',
      opinionSelect: [
        { label: '关闭风险', value: 1 },
        { label: '残余风险', value: 2 },
        { label: '要求重新处置', value: 3 },
      ],
      reviewResult: '', // 审核结果
      auditDeadline: '',
      riskResponsible: '',
      // resultForm: false, // 隐藏的处置人与截至日期
      recordBodyVisible: false, // 结果审核弹出的对话框
      color: 'var(--td-brand-color)',
      operationRecord: [],
    };
  },
  computed: {
    rowData() {
      return this.$route.query;
    },
  },
  watch: {
    reviewResult() {
      this.riskResponsible = '';
      this.auditDeadline = '';
      this.opinionTextarea = '';
    },
  },
  beforeDestroy() {
    removeSessionStorage('current');
  },
  mounted() {
    this.getRiskInfo();
    // 点击概览的查看 this.$route.params.current
    this.current = this.$route.params.current || getSessionStorage('current') || this.current;
    // if (getSessionStorage('current'))  this.current =getSessionStorage('current')
  },
  methods: {
    async getRiskInfo() {
      const res = await getRiskMsg(this.$route.query.id || this.rowData.id);
      const { questionAnswer, otherquestionAnswer, rsTemplateId } = res.data;

      const temRes = await getRiskTemplate(rsTemplateId);
      const { status } = res.data;
      this.description = res.data.description;
      this.current = status;
      // 处理风险标签的数据 todo
      this.riskMsg.label = res.data.label;
      // 左侧展示数据
      this.riskMsg = res.data;
      this.serialNumber = [];
      this.checkboxChoose = [];
      this.questionOption = [];
      // const questionName=JSON.parse(this.riskMsg.question).pages
      const answerSelection = JSON.parse(this.riskMsg.question).allRisk;
      const qusetionArr = this.riskMsg.questionPages.pages;
      this.getquestion(qusetionArr, this.riskMsg.questionName, otherquestionAnswer);
      this.questionContens.type = this.questionName?.type;

      this.getAnswer(
        answerSelection,
        this.riskMsg.questionName,
        this.handleQuestionAnswer(questionAnswer, otherquestionAnswer),
        this.questionContens.type,
      );

      const { law, level, description, label, type } = temRes.data;
      // 处理序号
      this.serialNumber.pop();
      this.serialNumber = this.serialNumber.join('.');
      this.$nextTick(() => {
        this.riskMsg.type = level;
        this.riskMsg.description = description;
        this.handleLable(label, type);
      });

      // 处理法律依据的数据
      this.$refs.law.innerText = law || '无法律依据';

      // 请求选择框选项的内容
      // debugger
      const riskOwners = await requestUserByOrg();
      this.riskSelection = riskOwners.map((item) => ({
        label: item.name,
        value: item.id,
      }));
      // 右侧表单数据
      const { disposalId, reviewId, reviewStopDate, disposalStopTime, disposalScheme, disposalDesc, reviewResult } =
        res.data;
      this.formData.principalValue = disposalId;
      this.formData.verifierValue = reviewId;
      this.formData.verifierDeadline = reviewStopDate || null;
      this.formData.principalDeadline = disposalStopTime || null;
      this.formData.disposalScheme = disposalScheme;
      this.formData.disposalDesc = disposalDesc;
      this.formData.reviewResult = reviewResult;
      // 操作记录
      if (res.data.rsListDetailList.length > 0) {
        this.operationRecord = res.data.rsListDetailList.reverse();
        this.formData.assignName = res.data.assignName;
        this.formData.principalValue = this.riskSelection.find((i) => i.value === this.formData.principalValue)?.label;
        this.formData.verifierValue = this.riskSelection.find((i) => i.value === this.formData.verifierValue)?.label;
        this.operationRecord.forEach((item) => {
          if (
            item.actionType === 1 &&
            (JSON.parse(item.content).disposalStopTime !== undefined ||
              JSON.parse(item.content).reviewStopTime !== undefined)
          ) {
            item.disposalStopTime = formatDate(JSON.parse(item.content).disposalStopTime);
            item.reviewStopTime = formatDate(JSON.parse(item.content).reviewStopTime);
          }
          if (item.actionType === 3 && JSON.parse(item.content)?.reviewResult !== undefined) {
            item.reviewResult = this.opinionSelect.find(
              (i) => i.value === Number(JSON.parse(item.content).reviewResult),
            )?.label;
          }
        });
      }
    },
    handleQuestionAnswer(QuestionAnswer) {
      if (QuestionAnswer[0] === '[') {
        QuestionAnswer = QuestionAnswer.substr(1);
        QuestionAnswer = QuestionAnswer.substring(0, QuestionAnswer.length - 1);
        QuestionAnswer = `${QuestionAnswer},`.split(',');
        QuestionAnswer.pop();
        return QuestionAnswer;
      }
      return [QuestionAnswer];
    },
    getquestion(val, questionName, otherquestionAnswer) {
      for (let i = 0; i < val.length; i++) {
        if (val[i].elements) {
          if (val[i].name[0] !== '面') {
            this.serialNumber?.push(val[i].name.slice(2, val[i].name.length));
          }
          this.getquestion(val[i].elements, questionName, otherquestionAnswer);
        }

        if (questionName === val[i].name) {
          this.questionContens.title = val[i].title;
          // this.serialNumber?.push(val[i].name.slice(2, val[i].name.length));
          this.questionName = { type: val[i]?.type };
          if (val[i]?.choices) {
            for (let j = 0; j < val[i]?.choices.length; j++) {
              if (!(val[i]?.choices[j] instanceof Object)) {
                this.questionOption.push({
                  label: val[i]?.choices[j],
                  value: val[i]?.choices[j],
                });
              } else {
                this.questionOption.push({
                  label: val[i]?.choices[j].text,
                  value: val[i]?.choices[j].value,
                });
              }
            }
          } else if (val[i].type === 'boolean') {
            this.labelTrue = val[i].labelTrue;
            this.labelFalse = val[i].labelFalse;
            this.valueTrue = val[i].valueTrue;
            this.valueFalse = val[i].valueFalse;
          }
          if (val[i].noneText) {
            this.questionOption.push({
              label: val[i]?.noneText,
              value: 'none',
            });
          }
          if (val[i].showOtherItem) {
            this.questionOption.push({
              label: val[i]?.otherText,
              value: otherquestionAnswer || 'other',
            });
          }
        }
      }
    },
    getAnswer(val, questionName, questionAnswer, type) {
      questionAnswer = questionAnswer.map((item) => item.trim());
      if (type === 'boolean') {
        // eslint-disable-next-line prefer-destructuring
        this.radioChoose = questionAnswer[0];
      }
      // 如果是checkbox
      if (type === 'checkbox') {
        this.checkboxChoose = questionAnswer;
      }
      if (type === 'radiogroup') {
        // eslint-disable-next-line prefer-destructuring
        this.radioChoose = questionAnswer[0];
      }
      // Object.keys(val).forEach((item) => {
      //   if (true) {
      //     val[item].forEach(() => {
      //       if (type === 'boolean') {
      //         // eslint-disable-next-line prefer-destructuring
      //         this.radioChoose = questionAnswer[0];
      //       }
      //       // 如果是checkbox
      //       if (type === 'checkbox') {
      //         this.checkboxChoose = questionAnswer;
      //       }
      //       if (type === 'radiogroup') {
      //         // eslint-disable-next-line prefer-destructuring
      //         this.radioChoose = questionAnswer[0];
      //       }
      //     });
      //   }
      // });
    },
    handleLable(label = '[]', type = '[]') {
      label = JSON.parse(label);
      type = JSON.parse(type);
      this.riskMsg.label = [...label, ...type];
    },
    async assign() {
      const { principalValue, verifierValue, principalDeadline, verifierDeadline } = this.formData;
      if (!principalValue || !verifierValue || !principalDeadline || !verifierDeadline) {
        this.$message.warning('填写');
        return;
      }
      const reAssignDTO = {
        disposalNameById: this.formData.principalValue,
        disposalScheme: this.formData.disposalScheme,
        disposalStopTime: this.formData.principalDeadline,
        ids: [this.rowData.id],
        reviewNameById: this.formData.verifierValue,
        reviewStopTime: this.formData.verifierDeadline,
      };
      const res = await sendrsAssign(reAssignDTO);
      if (res?.code === 200) {
        this.$message.success(res.message);
        setSessionStorage('current', '2');
        this.current = getSessionStorage('current');
        this.getRiskInfo();
      }
    },
    subBodyClose() {
      this.submitBodyVisible = false;
      this.endBodyVisible = false;
    },
    // res.url 图片地址；res.uploadTime 文件上传时间；res.error 上传失败的原因
    formatResponse(res) {
      // 响应结果添加上传时间字段，用于 UI 显示
      res.uploadTime = getCurrentDate();
      return res;
    },
    // 提交 审核的文件和描述
    async subFile() {
      if (!this.subTextarea) {
        this.$message.warning('必填');
        return;
      }
      // eslint-disable-next-line no-undef
      const newfiles = this.files.map((item) => item.url).join(',');
      const rsCheckDisposal = {
        disposalDesc: this.subTextarea,
        disposalProof: newfiles,
        id: this.rowData.id,
      };
      const res = await requestUploadFile(rsCheckDisposal);
      const code = res.slice(res.length - 3, res.length);
      if (code === '200') {
        this.$nextTick(() => {
          this.$message.success('提交成功');

          setSessionStorage('current', '3');
          this.current = getSessionStorage('current');
          this.submitBodyVisible = false;
          this.formData.fileName = this.files;
          this.getRiskInfo();
        });
      }
    },
    // 结果审核
    async subOpinion() {
      if (!this.reviewResult || (this.reviewResult === '3' && !this.auditDeadline)) {
        this.$message.warning('必填');
        return;
      }
      const rsCheckReview = {
        disposalId: this.riskResponsible,
        disposalStopTime: this.auditDeadline.replace('am', ' '),
        id: this.rowData.id,
        reviewOpinion: this.opinionTextarea,
        reviewResult: this.reviewResult,
      };
      const res = await requestcheckReview(rsCheckReview);
      if (res.code === 200) {
        if (this.reviewResult === 3) {
          if (!this.auditDeadline) {
            this.$message.warning('填写');
            return;
          }
          setSessionStorage('current', '2');
          this.subTextarea = '';
          this.files = [];
          this.reviewResult = '';
          this.opinionTextarea = '';
          this.auditDeadline = '';
        } else {
          setSessionStorage('current', '4');
        }
        this.$message.success(res.message);
        this.current = getSessionStorage('current');
        this.getRiskInfo();
        this.endBodyVisible = false;
      }
    },
    cancel() {
      this.$router.replace('/risk-assessment/governance');
    },
    goback() {
      this.recordBodyVisible = true;
    },
    recordBodyClose() {
      this.recordBodyVisible = false;
    },
    disableDate(time) {
      return time.getTime() < Date.now() - 8.64e7; // 只能选择今天以及今天之后的日期，如果没有后面的-8.64e7就是不可以选择今天的
      // return time.getTime() > Date.now() - 8.64e6; // 选择今天以及今天之前的日期，如果没有后面的-8.64e6就是不可以选择今天的
    },
    toAssessResult() {
      this.$router.push({
        path: `/risk-assessment/management/answer?id=${this.rowData.id}`,
      });
    },
  },
};
</script>

<style lang="less" scoped>
.box-right {
  margin-left: 40px;
  height: 24px;
  .files {
    div {
      width: 250px;
    }
    .t-link {
      vertical-align: middle;
    }
  }

  .title {
    padding: 22px 0;
    font-size: 15px;
  }
}
.box {
  font-family: 'PingFang SC';
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.7);

  .radio-group {
    width: 600px;
  }
  span {
    color: black;
    font-weight: 1200;
  }

  .grade-content {
    color: white;
    font-family: 'PingFang SC';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
  }
  .high {
    background-color: #e34d59;
  }
  .middle {
    background-color: #ed7b2f;
  }
  .low {
    background-color: #24d401;
  }
  .common {
    background-color: #7a7a7a;
  }

  .assess-content {
    color: #0052d9;
  }

  .tag {
    display: inline-block;
    box-sizing: border-box;
    text-align: center;
    line-height: 22px;
    // width: 16px;
    padding: 0 4px;
    height: 22px;
    border-radius: 3px;
    margin-left: 10px;

    // padding:2px 5px;
    .icon {
      margin-bottom: 4px;
    }
  }

  .content-red {
    border: 1px solid #e34d59;
    color: #e34d59;
    background: #fdecee;
  }

  .content-orange {
    border: 1px solid #ed7b2f;
    color: #ed7b2f;
    background: #ffeadd;
  }
}
.description {
  margin-top: 10px;
}
.label,
.box,
.assess {
  padding: 0 15px;
  // margin:0 -3.1%;
  span {
    color: black;
    font-weight: 800;
  }
}

.assess {
  padding: 4px 0;
  margin: -10px 0;
  .collapse-header {
    // width: 10px;
    color: black;
    .question {
      color: #0052d9;
      // width: 80%;
    }
  }
}
/deep/.t-radio__label {
  width: 70%;
  // margin-bottom: ;
}
/deep/.t-collapse-panel__header-content {
  width: 94%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.assess-select {
  padding: 0 5px;
  margin: 0 -15px;
}
.row-btn {
  margin-bottom: -2%;
  margin-top: -0.5%;

  .btn-box {
    display: flex;
    justify-content: flex-end;

    .cancel {
      margin-right: 10px;
    }
  }
}
.t-btn {
  display: flex;
  justify-content: center;
}
.timeline-custom-content {
  font-size: 12px;
  color: var(--td-text-color-secondary);
}
.record {
  margin-top: 5px;
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  .right {
    width: 65%;
    .tip {
      float: left;
      font-weight: 600;
      color: #0052d9;
    }
    .time {
      float: right;
    }
  }
}
.record_content {
  font-size: 12px;
  padding: 5px;
  background-color: #f3f3f3;
  border-radius: 3px;
  margin: 10px 0 30px 0;
}
/deep/.t-is-disabled {
  width: 100% !important;
}

.radio-group {
  div {
    width: 100%;
  }
}
/deep/ .t-checkbox__label {
  width: 95%;
}
/deep/.t-textarea__inner {
  max-height: 200px;
}
</style>
